<template>
  <!-- 分包商退库-新增 -->
  <div class="e-form">
    <BillTop title="分包商退库新增" @cancel="cancel"></BillTop>
    <div class="tabs">
      <div class="tabs-title">基本信息</div>
      <div style="width: 100%" class="form">
        <el-form
          :model="formData"
          label-width="150px"
          :rules="rules"
          ref="formData"
          class="demo-ruleForm"
        >
          <el-row>
            <el-col :span="12">
              <el-form-item label="所属机构">
                {{ formData.orgName }}
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="业务类型" prop="businessType">
                <el-select v-model="formData.businessType" placeholder="请选择">
                  <el-option
                    v-for="item in options"
                    :key="item.value"
                    :label="item.key"
                    :value="item.value"
                  >
                  </el-option>
                </el-select>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="12">
              <el-form-item label="退库日期" prop="returnDate">
                <el-date-picker
                  v-model="formData.returnDate"
                  type="date"
                  :placeholder="geyDate()"
                  value-format="yyyy-MM-dd"
                  :clearable="false"
                >
                </el-date-picker>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="状态">
                {{ "草稿" }}
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-form-item label="备注">
              <el-input
                type="textarea"
                :rows="2"
                placeholder="请输入内容"
                v-model="formData.remarks"
              >
              </el-input>
            </el-form-item>
          </el-row>
        </el-form>
      </div>
    </div>
    <div class="buttons">
    <span class="tip"
      ><span style="color: red; margin-right: 0">*</span>为必填项</span
    >
      <el-button
        type="primary"
        style="background: #2e61d7"
        @click="save('formData')"
         v-debounce
        >保存</el-button
      >
      <el-button @click="cancel()">关闭</el-button>
    </div>
  </div>
</template>

<script>
import '@/utils/jquery.scrollTo.min'
import request from '@/api/materials/subcontractorRetreat.js'

export default {
    data () {
        return {
            //表单数据
            formData: {
                billId: '',
                billNo: '',
                businessType: null,
                collectedQuantity: 0,
                founderId: '',
                founderName: '',
                gmtCreate: '',
                gmtModified: '',
                materialReturnPersonnelId: '',
                materialReturnPersonnelName: '',
                nullifyCreated: '',
                nullifyCreator: '',
                nullifyCreatorId: '',
                nullifyDescription: '',
                nullifyReason: '',
                orgId: this.orgId,
                orgName: '',
                remarks: '',
                returnDate: '',
                state: '0',
                stockReturnQuantity: 0,
                currentTotalReturnQuantity: 0,
                previousTotalReturnQuantity: 0,
                subcontractorId: '',
                subcontractorName: '',
                workId: '',
            },
            orgId: '', //机构id
            orgName: '', //机构名称
            isSkip: false, //是否跳转
            rules: {
                returnDate: [
                    { required: true, message: '请选择退库日期', trigger: 'change' },
                ],
                businessType: [
                    { required: true, message: '请选择业务类型', trigger: 'change' },
                ],
            },
            options: [
                {
                    value: 1,
                    key: '分包合同',
                },
                {
                    value: 2,
                    key: '加工合同',
                },
                {
                    value: 3,
                    key: '销售合同',
                },
                {
                    value: 4,
                    key: '事实合同',
                },
            ],
        }
    },
    computed: {},
    components: {},
    created () {
        let data = JSON.parse(localStorage.getItem('vuex'))
        this.orgId = data.userInfo.orgInfo.orgId
        this.formData.orgName = data.userInfo.orgInfo.orgName
        this.geyDate()
    },
    mounted () {},
    beforeDestroy () {},
    methods: {
    //保存
        save (formName) {
            if(this.formData.returnDate === '') {
                this.formData.returnDate = this.geyDate()
            }
            this.$refs[formName].validate(valid => {
                if (valid) {
                    request.AddSubcontractorRetreat(this.formData).then(res => {
                        this.clientPop('suc', '保存成功,是否继续', ()=>{
                            this.$router.replace({
                                path: '/subcontractorRetreatEdit',
                                query: {
                                    billId: res,
                                    name: 'receivingMaterials'
                                }
                            })
                        }, this.cancel)
                    })
                } else {
                    return false
                }
            })
        },
        //取消
        cancel () {
            this.$router.replace('/subcontractorRetreat')
        },
        //获取当前时间
        geyDate () {
            var myDate = new Date()
            let y = myDate.getFullYear()
            let m = myDate.getMonth() + 1
            let d = myDate.getDate()
            m = m < 10 ? '0' + m : m //小于10补0
            d = d < 10 ? '0' + d : d //小于10补0
            console.log('date', `${y}-${m}-${d}` )
            return `${y}-${m}-${d}`
        },
    },
}
</script>

<style lang="scss" scoped>
.buttons {
  left: 0;
}
.e-form {
  margin-bottom: 80px;
  padding: 0 20px;
  .tabs-title::before {
    content: "";
    height: 22px;
    width: 8px;
    border-radius: 40px;
    background-color: #2e61d7;
    display: block;
    position: absolute;
    left: 20px;
    margin-right: 20px;
  }
}

.e-table {
  background: #fff;
}

.el-tab-pane {
  margin-left: -10px;
}
</style>
